
import Configer from "../../../script/frame/apiModel/config/Configer";
import {DataRouter} from "../../../script/frame/dataSource/DataRouter";
import {AchievementData, AchievementType} from "../../../script/frame/dataSource/DataModel";
import {UIConfigKey} from "../../../script/constant/UIConfig";
import * as React from "../../../script/frame/apiModel/gui/React";
import {GuiKeys} from "../../../script/controller/model/ControllerOpt";
import {IProps, View} from "../../../script/frame/apiModel/gui/React";
import {PlayerFactory} from "../../../script/frame/PlayerFactory";
import {PlayerModel} from "../../../script/frame/apiModel/adapterModel/model4/PlayerModel";
import {TalentBarInterface} from "../../interface/GuiInterface";
import {ResourceKey} from "../../../script/constant/ResourceConstant";
import {CodeUtil} from "../../../script/frame/codeAdapter/CodeUtil";
import {publicGui} from "../../interface/PublicGui";
import {Logger} from "../../../script/frame/apiModel/config/Logger";

interface IProp {
    getAchFun: (player: PlayerModel) => { [key: string]: number }
}
interface IState {
    achs: {[p: string]: number};

    title: string;
    subTitle: string;
    des: string
    infoVisible: boolean;
    x: number;
    y: number;
}
export default class TalentBar extends TalentBarInterface<IProp, IState> {
    constructor(props: IProps & IProp) {
        super(props);
        this.state = {
            visible: false,
            achs: {},

            infoVisible: false,
            title: "",
            subTitle: '',
            des: '',
            x: 0,
            y: 0,
        }
    }


    render = () => {
        const talentBarBoard = Configer.getResource(ResourceKey.talentBarBoard);
        const backSize = { h: 0.58100, w: 0.37500 };
        const iconSize = { h: 0.07470, w: 0.05625 }
        const backPos = { x: 0.31250, y: 0.16600 }
        const allAch = DataRouter.getAchievementDatas();
        const maxAchNum = allAch.length;
        const fontSize = Configer.getUIConfig(UIConfigKey.fontSize) as number;


        const talents: AchievementData[] = [];

        for (let i = 0; i < maxAchNum; i++) {
            const achData = allAch[i];
            const type = achData.type;
            if (type === AchievementType.talent) {
            } else {
                continue;
            }
            if (achData && achData.id?.length > 0) {
                talents.push(achData);
            }
        }


        return <View   key={GuiKeys.talentBarCon} style={{ hidden: !this.state.visible, backgroundImage: talentBarBoard, paddingL: 0.00625, paddingT: 0.04316, width: backSize.w, height: backSize.h, left: backPos.x, top: backPos.y }}>
            {
                talents.map(
                    (talent, index, array) => {
                        let backgroundImage = Configer.getResource(ResourceKey.talentDisable);
                        const achId = talent.id;
                        let achNum = 0;
                        let hidden = true;
                        if (this.state.achs) {
                            achNum = this.state.achs[achId];
                        }
                        const lvSize = { h: fontSize, w: fontSize };
                        if (achNum && achNum > 0) {
                            hidden = false;
                            const iconPath = talent?.iconPath;
                            const resourceData = DataRouter.getResourceDataByResourceId(iconPath);
                            backgroundImage = resourceData?.src;
                        }

                        return <View   key={`${GuiKeys.talentBarItem}|${index}`} onMouseEnter={(event) => { this.showInfoPage(talent.name, '', talent.descript, event.x + iconSize.w, event.y) }} onMouseLeave={this.closeInfoPage} style={{ backgroundImage: backgroundImage, hidden: hidden, width: iconSize.w, height: iconSize.h, marginT: 0.01660, marginL: 0.01250 }}>
                            <View   key={`${GuiKeys.talentBarLv}|${index}`} style={{ float: true, fontSize: 0.01, width: lvSize.w, height: lvSize.h, marginT: 0.05644, marginL: 0.02500 }}>{achNum}</View>
                        </View>
                    }
                )
            }
        </View>
    }

    showInfoPage = (title: string, subTitle: string, des: string, x: number, y: number) => {
        if (!CodeUtil.isNullOrZero(title)) {
            publicGui.showInfoPage(x, y, title, subTitle, des);
        }
    }

    closeInfoPage = () => {
        publicGui.closeInfoPage();
    }

    closeBar = () => {
        this.setState({
            ...this.state,
            visible: false,
        })
    }
    openBar = () => {
        const achs = this.props.getAchFun(PlayerFactory.getInstance().getLocalPlayer());
        this.setState({
            ...this.state,
            visible: true,
            achs,
        })
    }

    getVisible = () => {
        return this.state.visible;
    }
}